<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的</title>
    <link rel="stylesheet" type="text/css" href="../../css/aui/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui/aui-slide.css" />
    <link rel="stylesheet" type="text/css" href="../../css/font/iconfont.css">
    <link rel="stylesheet" type="text/css" href="../../css/html/my/my.css">
    <style>

    </style>
</head>

<body>
    <div id="app" v-clock>
        <div class="header">
            <!-- <img class="head_bg" src="../../image/icon/geren_bg01.png" alt=""> -->
            <header class="aui-bar aui-bar-nav" id="header">个人中心</header>
            <div class="row_flex" style="height:5rem;padding-left:0.75rem;margin-top:0.3rem;">
                <div class='row_flex'>
                    <div class="portrait" onclick="addImg(this)">
                        <img :src="userInfo.headimgurl" onerror='this.src="../../image/icon/menu03.png"' alt="">
                    </div>
                    <div class="col_flex">
                        <div class="row_flex" style="justify-content: flex-start;">
                            <div v-if="userInfo.nickname">{{userInfo.nickname}}</div>
                            <div v-else>暂无</div>
                            <span style="margin-top:-0.4rem;">
                              <img v-if="userInfo.user_type === 2" src="../../image/icon/vip.png" style="width:0.8rem;" alt="">
                            </span>
                        </div>
                        <div style="font-size:0.7rem;margin:0.2rem 0;">
                            <div v-if="userInfo.user_type===2">
                                <span v-if="userInfo.work_cate_name">{{userInfo.work_cate_name}}</span><span v-else>暂无</span>
                                <div class="aui-label aui-label-info" style="font-size:0.5rem;" @click="openWin('upgrade');">升级</div>
                            </div>
                        </div>
                        <!-- <div @click="openWin('login')" style="margin-bottom:0.6rem;">点击登录</div> -->
                        <div style="font-size:0.6rem;">{{userInfo.user_tel}}</div>
                    </div>
                </div>
                <div class='row_flex wanshanxinxi' @click="openWin('perfect_information');">
                    <img src="../../image/icon/geren03.png" class="" alt="">完善资料
                </div>
            </div>
            <div class="qianbao_wrap">
                <div class="row_flex wodeqianbao" @click="openWin('my_wallet');">
                    <div>我的钱包</div>
                    <div>查看></div>
                </div>
                <div class="row_flex aui-margin-t-15">
                    <div style="width:50%;" @click="openWin('my_wallet');">
                        <div>￥{{userInfo.wallet_balance}}</div>
                        <div>我的余额</div>
                    </div>
                    <div style="width:1px;height:1rem;background:#fff;"></div>
                    <div style="width:50%;" class="zaixianchongzhi" @click="openWin('zaixian_chongzhi');">
                        <div><img src="../../image/icon/geren04.png" alt=""></div>
                        <div>在线充值</div>
                    </div>
                </div>
            </div>
            <div class="tixian" @click="openWin('tixian');"><img src="../../image/icon/geren05.png" class="" alt="">提现</div>
        </div>
        <!-- 宫格菜单 -->
        <section class="aui-grid" style="margin-top:1rem;">
            <div class="aui-row">
                <div class="aui-col-xs-3" @click="openWin('my_issue');">
                    <img src="../../image/icon/geren06.png" class="iconimg" alt="">
                    <div class="aui-grid-label">我的发布</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('mall_rights');">
                    <img src="../../image/icon/geren07.png" class="iconimg" alt="">
                    <div class="aui-grid-label">商城订单</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('order');">
                    <img src="../../image/icon/yonggongdindan.png" class="iconimg" alt="">
                    <div class="aui-grid-label">用工订单</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('my_apply');">
                    <img src="../../image/icon/my_apply.png" class="iconimg" alt="">
                    <div class="aui-grid-label">我的应聘</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('job_offer');">
                    <div class="aui-badge" v-if="dataStatistics.invite>0 && dataStatistics.invite<100">{{dataStatistics.invite}}</div>
                    <div class="aui-badge" v-else-if="dataStatistics.invite>99">99+</div>
                    <img src="../../image/icon/geren10.png" class="iconimg" alt="">
                    <div class="aui-grid-label">雇佣邀请</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('apply_list');">
                    <img src="../../image/icon/geren11.png" class="iconimg" alt="">
                    <div class="aui-grid-label">应聘列表</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('message_center');">
                    <div class="aui-badge" v-if="dataStatistics.unread>0 && dataStatistics.unread<100">{{dataStatistics.unread}}</div>
                    <div class="aui-badge" v-else-if="dataStatistics.unread>99">99+</div>
                    <img src="../../image/icon/geren12.png" class="iconimg" alt="">
                    <div class="aui-grid-label">消息中心</div>
                </div>
                <div class="aui-col-xs-3" @click="openWin('customerEquity');">
                    <img src="../../image/icon/geren13.png" class="iconimg" alt="">
                    <div class="aui-grid-label">会员权益</div>
                </div>
            </div>
        </section>
        <!-- 邀请 -->
        <div class="yaoqing_wrap">
            <div class="yaoqing_banner" @click="openWin('invite_friends');"><img src="../../image/img/yaoqinghaoyou.png" alt=""></div>
            <div class="yaoqing_btn aui-margin-t-10">
                <div class="img_btn" @click="openWin('recommended_amount');">
                    <div>推荐数量</div><img src="../../image/img/geren15.png" alt="">
                </div>
                <div class="img_btn" @click="applyMall();">
                    <div>申请成为商家</div><img src="../../image/img/geren16.png" alt="">
                </div>
            </div>
            <div class="yaoqing_btn aui-margin-t-10">
                <div class="img_btn" @click="registerWorkers()">
                    <div>注册成为工人</div><img src="../../image/img/geren17.png" alt="">
                </div>
                <!-- <div class="img_btn" @click="pay_security();">
                    <div>支付保障金</div><img src="../../image/img/geren18.png" alt="">
                </div> -->
                <div class="img_btn" @click="pay_memberInsureTreaty();">
                    <div>会员费|众筹金</div><img src="../../image/img/geren18.png" alt="">
                </div>
            </div>
        </div>
        <!-- 列表 -->
        <ul class="aui-list aui-list-in">
            <li class="aui-list-item" @click="openWin('offlineOrders')">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/xianxiaorder.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">线下订单</div>
            </li>
            <li class="aui-list-item" @click="openWin('my_collect')">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/my_shoucang.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">我的收藏</div>
            </li>
            <li class="aui-list-item" @click="huiYuanErWeiMa()">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/geren19.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">会员身份二维码</div>
            </li>
            <!-- <li class="aui-list-item" @click="openWin('reset_pwd');">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/up_pwd.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">修改密码</div>
            </li> -->
            <li class="aui-list-item" @click="openWin('security_center');">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/up_pwd.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">安全中心</div>
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/geren_14.png" class="iconimg" alt=""></i>
                </div>
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title">会员邀请码</div>
                    <div class="aui-list-item-right">{{userInfo.user_tel}}</div>
                </div>
            </li>
            <li class="aui-list-item" @click="openWin('addr');">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/daohang.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">地址管理</div>
            </li>
            <li class="aui-list-item" @click="openWin('service');">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/geren20.png" class="iconimg" alt=""></div>
                <div class="aui-list-item-inner">客服中心</div>
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-label-icon"><img src="../../image/icon/version.png" class="iconimg" alt=""></i>
                </div>
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title">版本号</div>
                    <div class="aui-list-item-right">{{version}}</div>
                </div>
            </li>
        </ul>

        <div class="btn" @click="logout()">退出登录</div>
    </div>
</body>

</html>
<script src="../../script/api.js" charset="utf-8"></script>
<script src="../../script/common/jquery-3.3.1.min.js" charset="utf-8"></script>
<script src="../../script/common/common.js" charset="utf-8"></script>
<script src="../../script/common/config.js" charset="utf-8"></script>
<script src="../../script/common/vue.min.js" charset="utf-8"></script>

<script type="text/javascript">
    apiready = function() {
        api.parseTapmode();
        vm.init();
    }

    var vm = new Vue({
        el: "#app",
        data: {
            userInfo: {},
            dataStatistics: {},
            version: ''
        },
        methods: {
            init() {
                var user_tel = get_local("user_tel");
                var user_pass = get_local("user_pass");

                this.version = api.appVersion != '0.0.0' ? api.appVersion : '0.1.3';

                this.statusBar();
                this.gerUserInfo();
            },
            gerUserInfo() {
                var that = this;
                var userInfo = get_local('userInfo');
                // 获取用户信息--信息不完善
                _ajax(Config.api.UserGetUser, {
                    user_id: userInfo.user_id
                }, function(ret) {
                    if (ret.code === 200) {
                        ret.data.user_id = userInfo.user_id;
                        that.userInfo = ret.data;
                        console.log(JSON.stringify(that.userInfo));
                        set_local('userInfo', that.userInfo);
                    }
                });

                // 数据统计/ 获取消息和雇佣统计
                _ajax(Config.api.UserGetDataStatistics, {
                    user_id: userInfo.user_id
                }, function(ret) {
                    if (ret.code === 200) {
                        that.dataStatistics = ret.data;
                    }
                });
            },
            openWin(name, slidBackEnabledState = true) {
                if (name) {
                    var winInfo = this.getUrlName(name);
                    open_w(winInfo.name, winInfo.url, winInfo.pageParam, slidBackEnabledState);
                } else {
                    $toast("正在开发中...");
                }
            },
            logout() {
                var user_tel = get_local("user_tel");
                var user_pass = get_local("user_pass");
                var user_region = get_local("user_region");

                $api.clearStorage();

                set_local("user_tel", user_tel);
                set_local("user_pass", user_pass);
                set_local("user_region", user_region);
                api.execScript({
                    name: 'login',
                    script: 'vm.init()'
                });

                this.openWin('login', false);
            },
            openCity() {
                var url = '../city/city_win.html';
                api.openFrame({
                    name: 'mask',
                    url: url,
                    rect: {
                        x: 0,
                        y: $api.byId('header').offsetHeight,
                        w: 'auto',
                        h: 'auto'
                    },
                    bgColor: 'rgba(0,0,0,0.5)', //主要是这里起作用哦
                });
            },
            applyMall() {
                var that = this;
                var winInfo = {
                    name: 'apply_business_win',
                    url: './apply_business/apply_business_win.html',
                    pageParam: {
                        type: 2
                    }
                };
                _ajax(Config.api.ShopIsApply, {
                    user_id: that.userInfo.user_id
                }, function(ret) {
                    if (ret.code === 200) {
                        // 1 获取用户申请资料
                        winInfo.pageParam.type = 1;
                        open_w(winInfo.name, winInfo.url, winInfo.pageParam);
                    } else if (ret.code === 201) {
                        // 2 提交商家申请资料
                        winInfo.pageParam.type = 2;
                        open_w(winInfo.name, winInfo.url, winInfo.pageParam);
                    }

                });
            },
            registerWorkers() {

                var that = this;
                if (this.userInfo.user_status !== 2) {
                    $toast("请先完善信息");
                    return;
                }
                if (this.userInfo.user_type === 2) {
                    $toast("已认证, 请到认证资料查看");
                    return;
                }
                _ajax(Config.api.UserAuthIsAuth, {
                    user_id: this.userInfo.user_id
                }, function(ret) {
                    if (ret.code === 200) {
                        that.openWin('show_register_workers_info');
                    } else {
                        that.openWin('register_workers');
                    }
                });
            },
            getUrlName(name) {
                var winInfos = {
                    //登录
                    login: {
                        name: 'login',
                        url: '../login/login.html'
                    },
                    // 升级
                    upgrade: {
                        name: 'upgrade_win',
                        url: './upgrade/upgrade_win.html'
                    },
                    // 完善资料
                    perfect_information: {
                        // name: 'perfect_information_win',
                        // url: './perfect_information/perfect_information_win.html',
                        name: 'data_list_win',
                        url: './perfect_information/workers/data_list_win.html',
                    },
                    // 我的钱包
                    my_wallet: {
                        name: 'my_wallet_win',
                        url: './my_wallet/my_wallet_win.html',
                    },
                    zaixian_chongzhi: {
                        name: 'zaixian_chongzhi_win',
                        url: './my_wallet/zaixian_chongzhi/zaixian_chongzhi_win.html'
                    },
                    tixian: {
                        name: 'tixian_win',
                        url: './my_wallet/tixian/tixian_win.html'
                    },

                    // 我的求职
                    my_issue: {
                        name: 'my_issue_win',
                        url: './my_issue/my_issue_win.html'
                    },
                    // 商城订单
                    mall_rights: {
                        name: 'mall_rights_win',
                        url: './mall_rights/mall_rights_win.html'
                    },
                    //用工订单
                    order: {
                        name: 'order',
                        url: '../order/index.html'
                    },
                    // 我的收藏
                    my_collect: {
                        name: 'my_collect_win',
                        url: './my_collect/my_collect_win.html'
                    },
                    //我的应聘
                    my_apply: {
                        name: 'my_apply_win',
                        url: './my_apply/my_apply_win.html'
                    },
                    // 雇佣邀请
                    job_offer: {
                        name: 'job_offer_win',
                        url: './job_offer/job_offer_win.html'
                    },
                    // 应聘列表
                    apply_list: {
                        name: 'apply_list_win',
                        url: './apply_list/apply_list_win.html'
                    },
                    // 消息中心
                    message_center: {
                        name: 'message_center_win',
                        url: './message_center/message_center_win.html'
                    },
                    // 会员权益
                    customerEquity: {
                        name: 'arc_arc_win',
                        url: '../arc/arc_arc_win.html',
                        pageParam: {
                            title: '会员权益',
                            url: Config.api.NewsCustomerEquity
                        }
                    },
                    // 客服中心
                    service: {
                        name: 'arc_arc_win',
                        url: '../arc/arc_arc_win.html',
                        pageParam: {
                            title: '客服中心',
                            url: Config.api.NewsCustomerService
                        }
                    },
                    // 文章列表
                    arc_list: {
                        name: 'arc_list_win',
                        url: '../arc/arc_list_win.html'
                    },

                    // 邀请好友
                    invite_friends: {
                        name: 'invite_friends_win',
                        url: './invite_friends/invite_friends_win.html'
                    },
                    // 推荐数量
                    recommended_amount: {
                        name: 'recommended_amount_win',
                        url: './recommended_amount/recommended_amount_win.html'
                    },
                    // 申请成为商家
                    apply_business: {
                        name: 'apply_business_win',
                        url: './apply_business/apply_business_win.html'
                    },
                    // 注册成为工人
                    register_workers: {
                        name: 'register_workers_win',
                        url: './register_workers/register_workers_win.html'
                    },
                    // 注册成为工人
                    show_register_workers_info: {
                        name: 'show_register_workers_info_win',
                        url: './register_workers/show_register_workers_info_win.html'
                    },
                    // 支付保障金
                    pay_security: {
                        name: 'pay_security_win',
                        url: './pay_security/pay_security_win.html'
                    },
                    //会员费|众筹金
                    member_insure_treaty: {
                        name: 'member_insure_treaty_win',
                        url: './member_insure_treaty/member_insure_treaty_win.html'
                    },
                    // 订单支付
                    offlineOrders: {
                        name: 'offlineOrders_win',
                        url: './offlineOrders/offlineOrders_win.html'
                    },
                    // 会员身份二维码
                    members_code: {
                        name: 'members_code_win',
                        url: './members_code/members_code_win.html'
                    },
                    // 修改密码
                    reset_pwd: {
                        name: 'reset_pwd',
                        url: '../login/reset_pwd.html'
                    },
                    //安全中心
                    security_center: {
                        name: 'security_center',
                        url: './security_center/security_center_win.html'
                    },
                    // 地址管理
                    addr: {
                        name: 'addr',
                        url: './addr/addr_win.html'
                    },
                    //打开地图
                    openMap: {
                        name: 'map_win',
                        url: '../map/map_win.html'
                    }
                };
                return winInfos[name];
            },
            huiYuanErWeiMa() {
                if (this.userInfo.user_status > 1) {
                    this.openWin('members_code');
                } else {
                    $toast("请完善基本资料");
                }
            },
            pay_security() {
                var that = this;
                if (this.userInfo.user_type === 1) {
                    _ajax(Config.api.AuthUserIsAuthEgis, {
                        user_id: this.userInfo.user_id
                    }, function(ret) {
                        if (ret.code === 200) {
                            that.openWin('pay_security');
                        } else {
                            $toast("您的认证资料未提交, 或者未审核, 请收到通知在支付");
                        }
                    });
                } else if (this.userInfo.user_type === 2) {
                    $toast("您已经是认证会员");
                }
            },
            pay_memberInsureTreaty() {
                var that = this;
                _ajax(Config.api.AuthUserIsAuthEgis, {
                    user_id: this.userInfo.user_id
                }, function(ret) {
                    if (ret.code === 200) {
                        that.openWin('member_insure_treaty');
                    } else {
                        $toast("您的认证资料未提交, 或者未审核, 请耐心等待审核！");
                    }
                });
            },
            statusBar() {
                //沉浸式状态栏
                var systemType = api.systemType;
                var statusBar = api.require('statusBar');
                if (systemType == "ios") {
                    if (navigator.userAgent.indexOf("iPhone") != -1) {
                        $("header").css({
                            "paddingTop": api.safeArea.top + 'px'
                        });
                    }
                } else {
                    statusBar.getStatusBarHeight(function(ret, err) {
                        $("header").css({
                            "paddingTop": ret.statusHeight
                        });
                    });
                }
            },
        }
    });


    function addImg(e) {
        imageUpload(Config.api.ImageUploadcommon, function(ret) {
            $(e).find('img').attr('src', ret.data.imgurl).css('width', '100%');

            var userInfo = get_local('userInfo');
            _ajax(Config.api.UserUpdateHeadimgurl, {
                user_id: userInfo.user_id,
                headimgurl: ret.data.imgurl
            }, function(ret) {
                if (ret.code === 200) {
                    //  修改成功
                }
            });
        });
    }

    window.addEventListener("scroll", function(e) {
        var t = document.documentElement.scrollTop || document.body.scrollTop;
        if (t > 100) {
            $("header").css({
                "position": "fixed"
            });
            $(".aui-bar-nav").removeClass("test1");
            $(".aui-bar-nav").addClass("test");
        } else {
            $("header").css({
                "position": "relative"
            });
            $(".aui-bar-nav").removeClass("test");
            $(".aui-bar-nav").addClass("test1");
        }
    });
</script>
